<%@ page language="java" contentType="text/html; charset=utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>鼎嘉旅游-票务预订</title>
</head>
<body>
<%@ include file="/WEB-INF/elements/header.jsp" %>
<!-- content begin -->
		<div class="clear"> </div>
		<!---start-content---->
			 <div class="wrap"> 
			<!---start-contact---->
			<div class="section group">				
				<div class="col span_1_of_3">
					<div class="contact_info">
			    	 	<h3>订单详情</h3>
			    	 		<div class="map">
					   			<img src="images/packages/p1.jpg" alt="package-place">
					   		</div>
      				</div>
      			<div class="company_address">
				     	<h3>厦门双飞五日游:</h3>
						    	<p>时间：五天六夜</p>
						   		<p>航班：来返免费</p>
						   		<p>出发地点：郑州</p>
				   		<p>景点:包括（）</p>
				   		<p>食宿:包早餐  中晚自理</p>
				 	 	<p>Email: <span>info@mycompany.com</span></p>
				   		<p>Follow on: <span>Facebook</span>, <span>Twitter</span></p>
				   </div>
				</div>				
				<div class="col span_2_of_3">
				  <div class="contact-form">
				  	<h3>确认信息</h3>
					    <form method="post" class="layui-form" action="contact-post.html">
					    	<div>
						    	<span><label>订票人姓名</label></span>
						    	<span><input name="userName" type="text" lay-verify="required" class="textbox"></span>
						    </div>
						    <div>
						    	<span><label>联系电话</label></span>
						    	<span><input name="userPhone" type="text" lay-verify="required|phone" autocomplete="off" class="textbox"></span>
						    </div>
						    <div>
						     	<span><label>身份证号码</label></span>
						    	<span><input name="userPhone" lay-verify="required|number" type="text" class="textbox"></span>
						    </div>
						    <div>
						    	<span><label>出行日期</label></span>
						    	<span><input name="userPhone" type="text" name="date" id="test5"  placeholder="yyyy-MM-dd HH:mm:ss" autocomplete="off" class="textbox"></span>
						    </div>
						    <div>
						    	<span><label>备注</label></span>
						    	<span><textarea name="userMsg"> </textarea></span>
						    </div>
						   <div>
						   		<span><input type="submit" lay-submit="" lay-filter="demo1" value="确认"></span>
						  </div>
					    </form>

				    </div>
  				</div>				
			  </div>
			  </div>
			<!---End-contact---->
<!-- content end -->
<%@ include file="/WEB-INF/elements/footer.jsp" %>
<script src="layui/layui.js" charset="utf-8"></script>
<script>
layui.use(['form', 'layedit', 'laydate'], function(){
  var form = layui.form
  ,layer = layui.layer
  ,layedit = layui.layedit
  ,laydate = layui.laydate;
  
  //日期
  laydate.render({
    elem: '#date'
  });
  laydate.render({
    elem: '#date1'
  });
//自定义验证规则
  form.verify({
    title: function(value){
      if(value.length < 5){
        return '标题至少得5个字符啊';
      }
    }
    ,pass: [/(.+){6,12}$/, '']
    ,content: function(value){
      layedit.sync(editIndex);
    }
  });
  
//监听提交
  form.on('submit(demo1)', function(data){
    layer.alert(JSON.stringify(data.field), {
      title: '最终的提交信息'
    })
    return false;
  });
//日期时间选择器
  laydate.render({
    elem: '#test5'
    ,type: 'datetime'
  });
  
  
});
  </script>
</body>
</html>